Google PageSpeed Insights: Cómo aumentar la puntuación de tu WordPress, parte II
Reducir el tiempo de respuesta del servidor
El tiempo de respuesta del servidor es el tiempo que pasa desde que un usuario solicita una página hasta que el servidor responde con el contenido de la página. Es decir, el servidor tiene que recibir la petición, ejecutar el WordPress (el core, plugins instalados, etc), hacer las consultas a base de datos, y montar la página. Así que este punto podemos dividirlo en estos otros tres puntos:
Revisa el tiempo de ejecución de los plugins que tienes instalados
El plugin P3 (Plugin Performance Profiler) analiza nuestro WordPress y nos ofrece un informe de los tiempos de ejecución de cada plugin, tiempo de ejecución del Core, número de consultas a base de datos…
Analizando el informe que nos ofrece podremos ver que plugin ralentizan más nuestro blog y buscar alternativas más rápidas.
Instala un plugin para gestionar la caché de servidor
En las páginas dinámicas, cada vez que un usuario visita una url, se hace todo el proceso de ejecución de PHP y consultas a base de datos. Pero que la página sea dinámica no quiere decir que el contenido vaya a cambiar constantemente, puede que actulicemos nuestro blog solo una vez al día, y que haya post que no toquemos una vez publicados. Por lo que tiene sentido guardar una copia estática de nuestras urls y mostrársela a los usuarios que acceden cuando sabemos que el contenido no ha cambiado. De esta forma le ahorramos trabajo al servidor y tiempo de espera al usuario.
El plugin que utilizo para gestionar la caché de servidor es el W3 Total Cache. Es un plugin muy completo, que además de gestionar la caché de servidor nos permite solucionar varios de los siguientes puntos (como minificar archivos o especificar caché de navegador). Para habilitar la caché con este plugin, solo tenemos que instalarlo, activarlo, y marcar la casilla
General Settings -> Page Cache -> Enabled
Contrata un servidor rápido
Evidentemente el tiempo de ejecución de estos procesos dependerá de la potencia de nuestro servidor. Si la página que estáis montando es mas o menos seria, es recomendable gastarse algo de dinero en el servidor y huir de los hosting gratuitos o «mas baratos del mundo».
Esta página está alojada en dreamhost.com desde hace más de 7 años y es la que en general recomiendo. Si no vaís varios cientos de miles de visitas mensuales o grandes picos de tráfico (por campañas de publicidad o emailings) su Shared Honsting es una opción muy válida por unos 100€ al año. Podéis utilizar el código ESEDEERRE al contratar el primero año y os descontarán 50€.
Para proyectos mas grandes, con cientos de miles de visitas mensuales, grandes picos de tráfico o mucha necesidad de transferencia, recomiendo un hosting especializado en WordPress: wpengine.com
Especificar caché de navegador
La solución a este punto dependerá del lugar donde estén almacenados los archivos.
Archivo alojados en nuestro servidor
Podemos especificar al navegador la frecuencia con la que cambian nuestros archivos estáticos. Por ejemplo podemos establecer una frecuencia de 1 mes para nuestros css, y así los usuarios que visiten con frecuencia nuestra web no cargarán siempre los css, solamente cuando haya pasado el tiempo necesario. Podemos especificar caché de navegador «a mano», editando nuestro archivo htaccess para añadir estas lineas:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
## EXPIRES CACHING ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresByType image/png "access 1 year" ExpiresByType text/css "access 1 month" ExpiresByType application/pdf "access 1 month" ExpiresByType text/x-javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresByType application/javascript "access plus 1 year" ExpiresDefault "access 2 days" ExpiresByType application/x-font-ttf "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" ExpiresByType application/vnd.ms-fontobject "access plus 1 month" </IfModule> ## EXPIRES CACHING ## |
O también podemos utilizar el W3 Total Cache para hacerlo: en el apartado Browser Cache marcamos las opciones: «
Archivos alojados en servidores externos
Solamente podemos especificar el caché de navegador para los archivos de nuestro servidor. Por ejemplo, no podemos hacerlo para el Javascript de Google Analytics, por lo que si utilizamos GA o cualquier otra libreria externa Google nos seguira penalizando en este punto.
Una solución para esto es copiar el archivo JS de analytics, y cargarlo desde nuestro servidor. Pero esto tiene el inconveniente de que si Google hace cualquier modificación en el archivo, GA podría dejar de funcionar en nuestra página. Así que tenemos que mantener la copia del archivo actualizada en nuestro servidor, y eso lo podemos hacer con un CRON de PHP .
Un CRON es un comando que ejecutamos cada cierto tiempo. Es decir, podemos crear un archivo PHP para copiar el archivo de analytics a nuestro servidor, y crear un CRON en el servidor para que ejecute ese archivo PHP cada hora. De esa manera aunque Google actualice el archivo, mantendremos una copia actualizada en nuestro servidor. Podéis ver todo el proceso detallado en este post.